{% extends "./inc_baseNew.html" %}
{% block content %}
<!-- -->
<style>
    .process-wrap {
        padding: 20px;
        margin: 0 0 20px 0;
        background-color: #fff;
        font-size: 15px;
    }

    .process-wrap a {
        text-align: center;
        font-size: 12px;
        color: #b0b0b0;
    }

    .info-wrap .row {
        text-align: center;
        margin: 15px 0;
        color:  #58636d;
    }
    .info-wrap .row .col{
        color:  #58636d;
    }
    .info-wrap div.row:not(:first-child)  {
        border-top: 1px solid #b0b0b0;
        padding:10px 0;
        margin: 0;
    }
    .info-wrap .row img {
        height: 49px;
    }
    .info-title {
        height:30px;
        line-height:30px;
        background-color: #f4f4f4;
    }
    a {
        color: #007bff;
    }
</style>
<section class="page-header page-header-xs">
    <div class="container">


    </div>
</section>
<!-- / -->
<!-- -->
<section>
    <div class="container">

        <div class="row">

            <!-- LEFT -->
            <div class="col-md-2 col-sm-2">
                <div class="panel panel-info" style="font-size:15px;text-align: center;margin: 10px 0;" >
                    <div class="row"  style="margin: 0 10px; padding: 10px;background-color: #4e9be6; justify-content: center; color:#fff; ">
                            <div > 搜索历史</div>
                    </div>
                    <div style="background-color: #fff;margin: 0 10px;">
                        <ul>
                            {%for q in hs|slice_array(0,10)%}
                            <li class="row" style="padding-top:5px;justify-content: center;"><a href="/search?q={{q|urlencode}}">{{q}}</a></li>
                            {%endfor%}
                        </ul>
                    </div>
                </div>

            </div>

            <!-- RIGHT -->
            <div class="col-md-10 col-md-10">
                <div class="panel panel-default">
                    <div class="panel-body" style="margin-top: 10px;">
                            <div class="row" style="font-size:15px;padding:10px;color: #58636d;" >
                                    <div class="col-2"> 获得 <span class="label label-light">{{count}}</span> 条结果 </div>
                            </div>
                            <div class="row">
                                    <div class="col-wy-4">
                                        <div class="process-wrap col">
                                            <div class="info-wrap">
                                                <div class="row info-title">
                                                    <div class="col">商品图片</div>
                                                    <div class="col">信息类型</div>
                                                    <div class="col">商品类别</div>
                                                    <div class="col">预计数量</div>
                                                    <div class="col">商品价格</div>
                                                    <div class="col">所在地区</div>
                                                    <div class="col">发布日期</div>
                                                    <div class="col">操作</div>
                                                </div>
                                                {% for item in list %}
                                                <div class="row align-items-center">
                                                    <div class="col">
                                                        {% set img = item.tupian|strToJson %}
                                                        {%if img.length >0 %}
                                                        <img src="{{img[0]}}" alt="">
                                                        {% else %}
                                                        <img src="/static/assets_new/img/blank.png">
                                                        {% endif %}
                                                    </div>
                                                    <div class="col">{{ item.xinxileixing |get_gongxutype}}</div>
                                                    <div class="col">{{item.shangpingleibie}}</div>
                                                    <div class="col">{{item.shangpingshuliang}}吨</div>
                                                    <div class="col">{{item.jiage}}元/吨</div>
                                                    <div class="col">{{item.diqu}}</div>
                                                    <div class="col">{{item.chuangjianshijian.split(" ")[0]}}</div>
                                                    <div class="col"><a  class="btn btn-sm btn-primary" style="    border: 1px solid #007bff;
                                                        color: #007bff;
                                                        background-color: #fff;" href="/home/gongxufabu/detail/?id={{item.id}}">查看详情</a></div>
                                                </div>
                                                {%else%}
                                                <div class="alert alert-warning margin-bottom-30"><!-- WARNING -->
                                                    <strong>提示!</strong> 没有搜索到您想要的结果！
                                                </div>
                                                {% endfor %}
                                            </div>
                                        </div>
                                    </div>
                                </div>
<!-- 
                        <div class="alert alert-warning margin-bottom-30">
                            <strong>提示!</strong> 没有搜索到您想要的结果！
                        </div> -->

                    </div>
                    {%if totalPages>1%}
                    <div class="panel panel-default form-inline" style="justify-content: center;">
                            <nav aria-label="Page navigation">
                                    <ul class="pagination flex-wrap">
                                      <li class="page-item">
                                        <a class="page-link" href="{{ctx.path}}?page={{page|int-1 or 1}}&{{ctx.query|query_string(['page'])}}" aria-label="Previous">
                                          <span aria-hidden="true">&laquo;</span>
                                          <span class="sr-only">Previous</span>
                                        </a>
                                      </li>
                                      {% for i in range(1, totalPages+1) -%}
                                      <li class="page-item {% if i==page%}active {%endif%}"><a class="page-link" href="{{ctx.path}}?page={{i}}&{{ctx.query|query_string(['page'])}}">{{ i }}</a></li>
                                      {%- endfor %}
                                      <li class="page-item">
                                        {% set nextpage = page|int+1%}{%if nextpage>totalPages %} {% set nextpage= totalPages %}{%endif%}
                                        <a class="page-link" href="{{ctx.path}}?page={{nextpage}}&{{ctx.query|query_string(['page'])}}" aria-label="Next">
                                          <span aria-hidden="true">&raquo;</span>
                                          <span class="sr-only">Next</span>
                                        </a>
                                      </li>
                                    </ul>
                                  </nav>
                            <div class="form-inline"  ><span style="margin: 0 1rem">到</span><input style="width: 60px;" type="number" name="pagenum" min="1" max="5" class="form-control form-control-sm mb-2 mr-sm-2"><span style="margin: 0 1rem 0 .5rem ">页</span><a class="page-link" href="javascript:gotoPage();" aria-label="Next">确定</a></div>
                    </div>
                    {%endif%} 
                </div>


            </div>

        </div>


    </div>
</section>
<!-- / -->

{% endblock %}
{% block script%}
<script>
var totalPages = {{totalPages}};
</script>
{% endblock %}